import Transaction from "https://cdn.jsdelivr.net/npm/@konghayao/promise-transaction/dist/promiseTransaction.browser.js";
import throttle from "https://cdn.jsdelivr.net/npm/lodash-es/throttle.js";
import draggable from "../plugins/draggable.js";
import { initIcon } from "./initIcon.js";
const AllIcon = [
    "Water",
    "Fei",
    "Drug",
    "Zoom",
    "Exam",
    "Next",
    "Menu",
    "Sound",
];
let config;
async function killShovel() {
    const el = app.stage.Shovel;

    await el.anime({
        height: 260 * px,
        width: 260 * px,

        x: app.config.width / 2,
        y: app.config.height / 2 + 150 * px,
    });
    await el.Loop(1);
    return new Promise((resolve) => {
        app.stage.Shovel.anime({
            alpha: { value: 0, duration: 1000, easing: "linear" },
            complete() {
                app.stage.Shovel.visible = false;
                app.stage.Shovel.removeAllListeners();
                app.stage.removeChild(app.stage.Shovel);
                delete app.stage.Shovel;
                resolve();
            },
        });
    });
}
export default new Transaction([
    [
        "load resource",
        () =>
            window.assetsLoader({
                Shovel: [
                    "./image/Flower/Shovel-0.webp",
                    "./image/Flower/Shovel-1.webp",
                    "./image/Flower/Shovel-2.webp",
                    "./image/Flower/Shovel-3.webp",
                    "./image/Flower/Shovel-4.webp",
                    "./image/Flower/Shovel-5.webp",
                    "./image/Flower/Shovel-6.webp",
                ],
                Title: ["./image/Title.png"],
            }),
    ],
    [
        "Hide All Icon",
        () => {
            AllIcon.forEach((i) => {
                app.stage[i].father.visible = false;
            });
            app.stage.Flower.visible = false;
        },
    ],
    [
        "init Title",
        () => {
            config = {
                height: 225 * px,
                width: 435 * px,
                x: app.config.width / 2,
                y: app.config.height / 2 - 100 * px,
            };
            let sprite = initIcon("Title", config);

            sprite.anime({
                rotation: [-0.2, 0],
                loop: true,
                direction: "alternate",
                duration: 2000,
            });
            app.stage.Title = sprite;
            app.stage.addChild(sprite);
        },
    ],

    [
        "init Shovel",
        () => {
            config = {
                height: 320 * px,
                width: 320 * px,
                x: app.config.width / 2 + 100 * px,
                y: app.config.height / 2,
            };
            let sprite = initIcon("Shovel", config);
            sprite.animationSpeed = 0.03;
            // sprite.play();
            draggable(sprite);
            // sprite.dragMessage.center = true;

            app.stage.addChild(sprite);
            app.stage.Shovel = sprite;
        },
    ],
    [
        "Open Event",
        () => {
            const Hand = app.stage.Shovel;
            const event = throttle(async (event) => {
                const isBump = window.B.hitTestRectangle(
                    Hand,
                    app.stage.Flower.HitObject
                );
                let a, b;
                if (isBump) {
                    Hand.dragMessage.draggable = false;
                    b = Promise.all([
                        killShovel().then(() => {
                            const { height, width } = app.stage.Menu.father;
                            app.stage.Flower.visible = true;
                            anime({
                                targets: AllIcon.map((i) => {
                                    const el = app.stage[i];
                                    el.father.visible = true;
                                    el.father.alpha = 0;
                                    return el.father;
                                }),
                                height: [0.5, 1].map((i) => i * height),
                                width: [0.5, 1].map((i) => i * width),
                                delay: anime.stagger(100),
                                alpha: 1,
                                complete() {
                                    app.stage.removeChild(app.stage.Title);
                                },
                            });
                            app.stage.removeChild(app.stage.KaiShi);
                            mui.prompt(
                                "请给你的小花取个名字吧",
                                Record.FlowerName,
                                "取名字开始游戏吧",
                                ({ value }) => {
                                    Record.FlowerName =
                                        value || Record.FlowerName;
                                    mui.toast(
                                        "你的小花名为\n" +
                                            Record.FlowerName +
                                            "\n好好照顾它吧"
                                    );
                                }
                            );
                        }),
                        app.stage.Flower.changeStates("first"),
                    ]);
                } else {
                    a = Hand.anime(config);
                }

                await Promise.all([a, b]);
            }, 100);
            Hand.on("pointerup", event);
            Hand.on(
                "pointermove",
                throttle((event) => {
                    if (Hand.dragMessage.dragging) {
                        const { x, y } = config;
                        const dest =
                            ((event.data.global.x - x) ** 2 +
                                (event.data.global.y - y) ** 2) **
                            0.5;
                        const rate = 0.4 + 0.6 * (dest / 400);
                        Hand.scale.x = rate;
                        Hand.scale.y = rate;
                    }
                }, 100)
            );
            Hand.on("pointerout", event);
        },
    ],
    [
        "init KaiShi",
        () => {
            var text = new PIXI.Text("拖拽铲子开始种植", {
                fontFamily: "DOUYU Font",
                fontSize: 24,
                fill: "#ffffff",
                align: "center",
            });
            text.x = app.config.width / 2;
            text.y = app.config.height - 200 * px;

            text.anchor.set(0.5, 0.5);
            app.stage.KaiShi = text;
            app.stage.addChild(text);
        },
    ],
]);
